<template>
	<view class="grant-bg" :style="[{backgroundImage:'url(https://txr001.zthj.net/static/img/grantBg.png)'}]">
		<cu-custom :isBack="true" :isWhiteBack="true" style="background-color: transparent;">
			<block slot="content">
				<view class="custom-white-title">{{info.type == 2 ? '打卡' : '问卷'}}发放</view>
			</block>
		</cu-custom>
		<view class="grant-content">
			<view class="top-title">ID:{{info.code}}</view>
			<view class="title">{{info.title}}</view>
			<view class="desc">
				{{info.subtitle}}
			</view>
			<view class="padding-top-48">
				<view class="text-767879 text-26">发起单位：</view>
                <view class="text-0101 text-26">{{info.unit}}</view>
			</view>

			<view v-if="info.type == 1" class="padding-top-32">
				<view class="text-767879 text-26">截止时间：</view>
			    <view class="text-0101 text-26">{{info.end_time_text}}</view>
			</view>

            <view v-if="info.type == 2" class="padding-top-32">
                <view class="text-767879 text-26">打卡时间：</view>
                <view class="text-0101 text-26">{{info.daka}}</view>
            </view>

            <view v-if="info.type == 2" class="padding-top-32">
                <view class="text-767879 text-26">任务周期：</view>
                <view class="text-0101 text-26">{{info.start_date_text}} ~ {{info.end_date_text}}</view>
            </view>
		</view>
		<view class="foot-bottom">
			<view class="flex justify-between align-center">
				<button class="cu-btn recept-btn" @click="apply">接受发放</button>
				<button class="cu-btn refuse-btn" @click="back">拒接发放</button>
			</view>
			<view class="text-center logo-text">
				<image src="https://txr001.zthj.net/static/img/bottomLogo.png" class="bottom-logo-class"></image>
				<text class="text-img-center">青牒碳账户提供</text>
			</view>
		</view>
	</view>
</template>


<script>
export default {
    components: {

    },
    data() {
        return {
            s_id:0,
            info:{},


        }
    },
    onLoad(options) {
        if (options.scene) {
            options = this.url2obj(decodeURIComponent(options.scene));
        }
        console.log('s_id', options.s_id);
        if(!options.s_id){
            uni.showModal({content:'参数错误',showCancel:false})
            return;
        }
        this.s_id = options.s_id;
        this.load()
    },
    methods:{
        back(){
            uni.reLaunch({
                url: '/pages/index/index',
            })
        },
        async apply(){
            let res = await this.$api.acceptStatistics({
                s_id : this.s_id,
            })
            if(res.code == 1){
                uni.redirectTo({
                    url: '/subpackage/pages/voucher/index'
                })
            }
        },
        url2obj(query) {
            var reg = /([^=&\s]+)[=\s]*([^&\s]*)/g;
            var obj = {};
            while (reg.exec(query)) {
                obj[RegExp.$1] = RegExp.$2;
            }
            return obj;
        },
        async load(){
            let res = await this.$api.statisticsInfo({s_id: this.s_id})
            this.info = res.data.info
        }
    }
}
</script>


<style>
	page{background-color: #f5f5f5;}
</style>
<style scoped lang="less">
	.grant-bg{
		background-size: 100% 100%;
		width: 100%;
		height: 410rpx;
		.grant-content{
			margin: 76rpx 32rpx 0;
			background: #FFFFFF;
			border-radius: 48rpx;
			padding: 32rpx;
			.top-title{
				font-size: 26rpx;
				font-weight: 400;
				color: #010101;
			}
			.title{
				margin-top: 48rpx;
				font-size: 40rpx;
				font-weight: 600;
				color: #010101;
			}
			.desc{
				padding-top: 8rpx;
				font-size: 26rpx;
				font-weight: 400;
				color: #767879;
			}
		}
		.foot-bottom{
			padding: 0 48rpx;
			width: 100%;
			position: fixed;
			left: 0;
			bottom: 90rpx;
			// display: flex;
			// align-items: center;
			// justify-content: space-between;
			.recept-btn{
				width: 312rpx;
				height: 88rpx;
				background: #24458E;
				border-radius: 44rpx;
				font-size: 32rpx;
				font-weight: 400;
				color: #FFFFFF;
			}
			.refuse-btn{
				width: 312rpx;
				height: 88rpx;
				border-radius: 44rpx;
				border: 2rpx solid #010101;
				font-size: 32rpx;
				font-weight: 400;
				color: #010101;
			}
		}
	}
	.logo-text{
		vertical-align: middle;
		padding-top: 22rpx;
		font-size: 24rpx;
		font-weight: 400;
		color: #BBBDC3;
	}
	.bottom-logo-class{
		vertical-align: middle;
		width: 19.76rpx;height: 28rpx;
		margin-right: 4rpx;
	}
</style>